<template>
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <!-- 照片如果要写成活的，应该放在public下  并且将retrun中的../assets 删掉 -->
      <div v-for="(img,index) in imgs" :key="index" class="swiper-slide">
        <img :src="img">
      </div>
    </div>
  </div>
</template>

<script>
import Swiper from "swiper";
import "../../node_modules/swiper/css/swiper.min.css";

export default {
  name: "Slideshow",
  data() {
    return {
      imgs:[
        "/img/1.jpg",
        "/img/2.jpg",
        "/img/3.jpg"
      ]
    }
  },
  mounted() {
    new Swiper(".swiper-container", {
      autoplay: false, 
    });
  },
};
</script>

<style scoped>
.swiper-container {
  margin-top: 0.4rem;
  width: 100%;
  height: 3.75rem;
  background-color: white;
}
.swiper-slide>img{
  width: 100%;
  height: 100%;
}
</style>